<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>后台管理模板</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="../../layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="../../css/global.css" media="all">
	<link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/font-awesome.4.6.0.css">
	<link rel="stylesheet" href="../../datatables/media/css/jquery.dataTables.css">
	<link rel="stylesheet" href="../../datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css">
	<!-- <style type="text/css">
		.userdetail {
			width: 360px;
			height: 180px;
			background-color: rgba(54, 179, 168, 0.91);
			margin: 20px auto;
			text-align: center;
			box-shadow:3px 2px 6px #000
		}
		.userdetail label {
			font-size: 17px;
			line-height: 25px;
		}
		.numItem {
			color: white;
		}
		#userDetailselect {
			position: relative;
			bottom: -19px;
		}
	</style> -->
<style type="text/css">
			.userdetail {
				width: 360px;
				height: 200px;
				background-color: rgba(54, 179, 168, 0.91);
				margin: 20px auto;
				text-align: center;
				box-shadow:3px 2px 6px #000
			}
			.userdetail label {
				font-size: 17px;
				line-height: 25px;
			}
			.numItem {
				color: white;
			}
			#userDetailselect {
				position: relative;
    			bottom: -19px;
			}
		</style>

</head>
<body>
	<div class="layui-layout layui-layout-admin" style="border-bottom: solid 5px #1aa094;">
		<!--头部导航-->
		<div class="layui-header header header-demo" ></div>
		<!--左侧导航-->
		<div class="layui-side layui-bg-black" id="admin-side">
		</div>
		<!--右侧具体内容-->
		<div class="layui-body" style="bottom: 0;border-left: solid 2px #1AA094;padding:20px" id="admin-body">
			<div class="title">用户账号详情</div>
			<hr/>
			<div class="userdetail">
				<img class="detailimg" id="useimg" src="../../images/xiaosong.jpg">
				<div><label id="usernickname">矮大紧</label>&nbsp;&nbsp;<label id="usersex">男</label></div>
				<div><label id="phonenum">13819151219</label></div>
				<div>
					<label>信誉分：</label><label class="numItem" id="usercredit">22</label>&nbsp;&nbsp;|&nbsp;&nbsp;
					<label>积分：</label><label class="numItem" id="usermark">33</label>&nbsp;&nbsp;|&nbsp;&nbsp;
					<label>订单总数：</label><label class="numItem" id="userordernum">33</label>
				</div>
				<!-- <div>
					<label>创建时间：</label><label class="numItem" id="createtime">2017-1-1</label>&nbsp;&nbsp;|&nbsp;&nbsp;
					<label>最近使用：</label><label class="numItem" id="lastuse">2017-8-8</label>
				</div> -->
				<div>
						<label>创建时间：</label><label class="numItem" id="createtime">2017-1-1</label>
					</div>
					<div>
						<label>最近使用：</label><label class="numItem" id="lastuse">2017-8-8</label>
					</div>
			</div>
			<div style="float: left;position: absolute;top:272px;z-index: 99;">
				<select name="expreselect" lay-verify="" id="userDetailselect">
					<option value="-1">排序方式</option>
					<option value="1">只看请求订单</option>
					<option value="2">只看代购订单</option>
					<option value="3">已完成订单</option>
					<option value="4">未完成订单</option>
					<option value="5">按完成使用↑</option>
					<option value="6">按完成使用↓</option>
					<option value="7">按创建时间↑</option>
					<option value="8">按创建时间↓</option>
				</select>
			</div>
			<div class="layui-form">
				<table class="layui-table" id="userdetailTable">
					<thead>
						<tr>
							<th style="width: 80px">订单类型</th>
							<th>创建日期</th>
							<th>完成日期</th>
							<th>相关用户</th>
							<th>相关快递员</th>
							<th>状态</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>请求订单</td>
							<td>2017-6-30</td>
							<td>2017-6-30</td>
							<td><img src="../../images/0.jpg"><span>lzy</span></td>
							<td>快递员1号</td>
							<td>已完成</td>
							<td><div class="layui-btn  layui-btn-small">详情</div><div class="layui-btn layui-btn-danger layui-btn-small">关闭</div></td>
						</tr>
						<tr>
							<td>代购订单</td>
							<td>2017-8-8</td>
							<td>2017-9-8</td>
							<td><img src="../../images/1.jpg"><span>czl</span></td>
							<td>快递员1号</td>
							<td>已完成</td>
							<td><div class="layui-btn  layui-btn-small">详情</div><div class="layui-btn layui-btn-danger layui-btn-small">关闭</div></td>
						</tr>
						<tr>
							<td>代购订单</td>
							<td>2017-8-8</td>
							<td>2017-8-8</td>
							<td><img src="../../images/xiaosong.jpg"><span>hwjs</span></td>
							<td>快递员1号</td>
							<td>已完成</td>
							<td><div class="layui-btn  layui-btn-small">详情</div><div class="layui-btn layui-btn-danger layui-btn-small">关闭</div></td>
						</tr>
					</tbody>
				</table>
			</div>
			<!--底部导航-->
			<div class="layui-footer footer footer-demo" id="admin-footer"></div>
			<!--JS模块-->
			<script type="text/javascript" src="../../layui/layui.js"></script>
			<script src="../../js/jquery-1.12.3.min.js"></script>
			<script type="text/javascript" src="../../js/jquery.cookie.js"></script>
			<script src="../../js/index.js"></script>
			<!-- DataTables JavaScript -->
			<script src="../../datatables/media/js/jquery.dataTables.min.js"></script>
			<script>
				var data = {
					"code": 200,
					"user": {
						//"signature": "我有一个不成熟的小建议",
						// "birthday": "2011-2-1",
						// "region": "北京",
						//"permissions": 82186,
						// "userState": "使用中",
						"userId": 66677,
						"sex": "男",
						"nickname": "矮大紧",
						"headPortraitUrl": "../../images/xiaosong.jpg",
						"username": "15967179986",
						"lastLoginTime": "2018-3-3",
						"userRegisterTime": "2017-7-7",
						"integralScore": 452,
						"creditScore": 65, //还要传来相关订单

						"orderNum": 44
					}
				}

				var data2 = {
					"code": 200,
					"orderStatisticalVos": [{
						"orderId": 12345,
						"type": 1,//1请求 2代购
						"demandCreatetime": 5646546,//创建日期
						"arriveTime": 654654564,//完成日期
						//若是代购订单
						"userId": 123123,
						"headPortraitUrl": "../../images/fems.jpg",
						"nickname": "大灰狼",
						//若是请求订单
						"purchaseUserId": 53428,
						"purchaseUserheadPortraitUrl": "../../images/jn.jpg",
						"purchaseUserNickname": "小白兔",

						"courierId": 54124,//快递员id
						"courierNickname": "啦啦啦",
						"courierHeadPortraitUrl": "../../images/dx.jpg",
						"courierUserId": 55569,//快递员作为用户时的id
						"orderState": 1,
					},{
						"orderId": 123458,
						"type": 2,//1请求 2代购
						"demandCreatetime": 654654564,//创建日期
						"arriveTime": 654654564,//完成日期
						//若是代购订单
						"userId": 123123,
						"headPortraitUrl": "../../images/am.jpg",
						"nickname": "大灰狼",
						//若是请求订单
						"purchaseUserId": 53428,
						"purchaseUserheadPortraitUrl": "../../images/1.JPG",
						"purchaseUserNickname": "小白兔",

						"courierId": 54124,//快递员id
						"courierNickname": "啦啦啦",
						"courierHeadPortraitUrl": "../../images/0.jpg",
						"courierUserId": 55569,//快递员作为用户时的id
						"orderState": 1,
					},{
						"orderId": 123455,
						"type": 1,//1请求 2代购
						"demandCreatetime": 654654564,//创建日期
						"arriveTime": 654654564,//完成日期
						//若是代购订单
						"userId": 123123,
						"headPortraitUrl": "../../images/find_1.png",
						"nickname": "大灰狼",
						//若是请求订单
						"purchaseUserId": 53428,
						"purchaseUserheadPortraitUrl": "../../images/xiaosong.jpg",
						"purchaseUserNickname": "小白兔",

						"courierId": 54124,//快递员id
						"courierNickname": "啦啦啦",
						"courierHeadPortraitUrl": "../../images/mm.jpg",
						"courierUserId": 55569,//快递员作为用户时的id
						"orderState": 7,
					}]
				}

				var userId;
				$(function() {
					$("#user").addClass('layui-this'); //对应订单管理的背景色
					$('#userdetailTable').DataTable({
						responsive: true,
						ordering: false,
						searching: true,
						"bLengthChange": false,
						"bRetrieve": true,
						"bFilter": true //过滤功能
					});
					C1 = window.location.href.split("?")[1];
					userId = C1.split("=")[1];
					//alert(userId);
					userdetail(userId)
					UO_SelectChange(-1)
					adminCookie()
				})

				function userdetail(userId) {
					$.ajax({
						url: '/randomdelivery/AdminController/user/'+userId,
						type: 'GET',
						dataType: 'json',
						contentType: "application/json",
						async: true,
						success: function(data) {
							$("#useimg").text(data.user.headPortraitUrl);
							$("#usernickname").text(data.user.nickname);
							$("#usersex").text(data.user.sex);
							$("#phonenum").text(data.user.username);
							$("#usercredit").text(data.user.creditScore);
							$("#usermark").text(data.user.integralScore);
							$("#userordernum").text(data.user.orderNum);
							$("#createtime").text(new Date(data.user.userRegisterTime).Format("yyyy-MM-dd hh:mm:ss"));
							$("#lastuse").text(new Date(data.user.lastLoginTime).Format("yyyy-MM-dd hh:mm:ss"));
						},
						Error: function() {
							alert("服务器出错");
						}
					})

				}

				$(document).on('click', '.orderclose', function() {
					k = $(this).parents("tr").index() + 1;
					var element = this
					layui.use('layer', function() {
						var layer = layui.layer;
						layer.confirm('是否要关闭选中订单', {
							icon: 2,
							title: '提示'
						}, function(index) {
							layer.confirm('关闭订单后不可恢复 是否仍关闭订单？', {
								icon: 2,
								title: '提示'
							}, function(index) {
								 $.ajax({
                             type: "POST",
                             url: "/randomdelivery/AdminController/closeOrderByOrderId/"+element.id,
                             data: {},
                             async: true,
                             dataType: "json",
                             contentType: "application/json",
                             success: function(data) {
                             	if (data.code == 200) {
                             		$("table#userdetailTable").find("tr:eq(" + k + ")").children('td:nth-child(6)').text("关闭").css('color', 'red');
                             		$("table#userdetailTable").find("tr:eq(" + k + ")").children('td:nth-child(7)').children('.orderclose').attr('class', 'layui-btn layui-btn-disabled  layui-btn-small')
                             		layer.close(index);
                             	}
								},
                             Error: function() {
                                 alert("服务器出错");
                             }
                         })
                     })
						});

					});
				})

				

				function UO_SelectChange(v) {
					var url = "/randomdelivery/AdminController/userAllOrders/pageCount/1/pageSize/10";
					var sequence = -1;
					switch(parseInt(v))
					{
						case -1:							
						break;
						case 1:
							url ="/randomdelivery/AdminController/userDemandOrders/pageCount/1/pageSize/10" 
						break;
						case 2:
							url ="/randomdelivery/AdminController/userPurcaseOrders/pageCount/1/pageSize/10" 						
						break;
						case 3:
							sequence = 1;
						break;
						case 4:
							sequence = 2;
						break;
						case 5:
							sequence = 3;
						break;
						case 6:
							sequence = 4;
						break;
						case 7:
							sequence = 5;
						break;
						case 8:
							sequence = 6;
						break;
						

					}

					/*<option value="0">排序方式</option>
					<option value="1">只看请求订单</option>
					<option value="2">只看代购订单</option>
					<option value="3">已完成订单</option>
					<option value="4">未完成订单</option>
					<option value="5">按完成使用↑</option>
					<option value="6">按完成使用↓</option>
					<option value="7">按创建时间↑</option>
					<option value="8">按创建时间↓</option>*/
					$.ajax({
                     type: "GET",
                     "url": url,
                     data: {
                        "sequence": sequence,
						"userId": userId
                     },
                     async: true,
                     dataType: "json",
                     contentType: "application/json",
                     success: function(data) {
                     	//alert(123)
                     	//alert(JSON.stringify(data))
                     	uodata(data);
					},
                     Error: function() {
                         alert("服务器出错");
                     }
                 })
             }


             $("#userDetailselect").bind("change", function() {
             	UO_SelectChange($(this).val())
             })

             function userOrder_Detail(orderId) {
             	window.location.href = "../orderManage/orderdetail.html?orderId=" + orderId
             }

				Date.prototype.Format = function(fmt) { //author: meizz 
					var o = {
					"M+": this.getMonth() + 1, //月份 
					"d+": this.getDate(), //日 
					"h+": this.getHours(), //小时 
					"m+": this.getMinutes(), //分 
					"s+": this.getSeconds(), //秒 
					"q+": Math.floor((this.getMonth() + 3) / 3), //季度 
					"S": this.getMilliseconds() //毫秒 
				};
				if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
				for (var k in o)
					if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
				return fmt;
			}

			function uodata(data) {
					$('#userdetailTable').dataTable().fnClearTable(); //清除表格内
					$.each(data.orderStatisticalVos, function(index, item) {
						var orderState
						switch(parseInt(item.orderState))
						{
							case 0:
							orderState = "等待代购人确定金额";
							break;
							case 1:
							orderState = "确认且未支付";
							break;
							case 2:
							orderState = "已支付";
							break;
							case 3:
							orderState = "找快递员";
							break;
							case 4:
							orderState = "待取件";
							break;
							case 5:
							orderState = "派送中";
							break;
							case 6:
							orderState = "完成";
							break;
							case 7:
							orderState = "关闭";
							break;
							case 8:
							orderState = "退款中";
							break;
							case 9:
							orderState = "已结束";
							break;
						}


						/*if (item.orderState == 0) {
							orderState = "等待代购人确定金额"
						} else if (item.orderState == 1) {
							orderState = "确认且未支付"
						} else if (item.orderState == 2) {
							orderState = "已支付"
						} else if (item.orderState == 3) {
							orderState = "找快递员"
						} else if (item.orderState == 4) {
							orderState = "待取件"
						} else if (item.orderState == 5) {
							orderState = "派送中"
						} else if (item.orderState == 6) {
							orderState = "完成"
						} else if (item.orderState == 7) {
							orderState = "关闭"
						} else if (item.orderState == 8) {
							orderState = "退款中"
						}*/
						var demandCreatetime = new Date(item.demandCreatetime).Format("yyyy-MM-dd hh:mm:ss")
						var arriveTime = new Date(item.arriveTime).Format("yyyy-MM-dd hh:mm:ss")

						if (item.type == 1) {
							$('#userdetailTable').dataTable().fnAddData([
								'请求订单',
								demandCreatetime,
								arriveTime,
								'<img src=' + item.purchaseUserheadPortraitUrl + '><span>' + item.purchaseUserNickname + '</span>',
								'<img src=' + item.courierHeadPortraitUrl + '><span>' + item.courierNickname + '</span>',
								orderState,
								'<div class="layui-btn  layui-btn-small user_detail" onclick = "userOrder_Detail(' + item.orderId + ')">详情</div><div class="layui-btn layui-btn-danger  layui-btn-small orderclose" id=' + item.orderId + '>关闭</div>'
								]);
						} else {
							$('#userdetailTable').dataTable().fnAddData([
								'代购订单',
								demandCreatetime,
								arriveTime,
								'<img src=' + item.headPortraitUrl + '><span>' + item.nickname + '</span>',
								'<img src=' + item.courierHeadPortraitUrl + '><span>' + item.courierNickname + '</span>',
								orderState,
								'<div class="layui-btn  layui-btn-small user_detail" onclick = "userOrder_Detail(' + item.orderId + ')">详情</div><div class="layui-btn layui-btn-danger  layui-btn-small orderclose" id=' + item.orderId + '>关闭</div>'
								]);
						}
						if (item.orderState == 7) {
							$("table#userdetailTable").find("tr:eq(" + (index + 1) + ")").children('td:nth-child(7)').children('.orderclose').attr('class', 'layui-btn layui-btn-disabled  layui-btn-small')
							$("table#userdetailTable").find("tr:eq(" + (index + 1) + ")").children('td:nth-child(6)').text("关闭").css('color', 'red');
						};
					})
				}



				
			</script>

		</div>
	</div>
</body>
</html>